<template>
	<view>
		<block v-if="isload">
			<form @submit="formsubmit">
				<view class="st_box">
					<view class="st_form">
						<view class="video-info">
							<view class="des">
								<textarea v-model='videoDes' v-html @input="handleVideoDes" placeholder="输入描述信息"
									name="content">
									</textarea>
									</view>

							<view class="video-cover">

								<view class="uploadbtn" @tap="uploadimg" data-field="pics" v-if="pics.length<1">
									<image :src="pre_url+'/static/img/shaitu_icon.png'" />
									<view class="tip">
										上传封面
									</view>
								</view>

								<view v-for="(item, index) in pics" :key="index" class="upload-cover">
									<view class="upload-cover-close" @tap="removeimg" :data-index="index" data-field="pics">
										<image src="/static/img/ico-del.png"></image>
									</view>
									<image class="upload-cover-img" :src="item" @tap="previewImage" :data-url="item" mode="widthFix">
									</image>
								</view>

							</view>
						</view>

						<view class="action-area">
							<view class="buttons">
								<view class="action"> # 热门话题 </view>
								<view class="action"  @tap="showFollowPopup()" > @ 我的朋友 </view>
							</view>
							<view class="topic-list">
								<view class="topic-item" v-for="(item,index) in clist" :key="index"
									:class=" activeTopicarr.includes(item.id)?'active':''" @tap="changeTopic(item.id,item.name)">
									{{item.name}}
								</view>
							</view>
						</view>

						<input type="text" hidden="true" name="pics" :value="pics.join(',')" maxlength="-1"></input>

						<view class="uploadbtn_ziti2">上传短视频（必选视频）</view>
						<view class="flex-y-center"
							style="width:100%;margin-top: 20px;border-width: 1px;border-style: solid;border-color: #F1F5F8;background-color: #F1F5F8;border-radius: 6px;padding: 8px;">
							<image :src="pre_url+'/static/img/uploadvideo.png'"
								style="width:100rpx;height:100rpx;background:#ffffff;border-radius: 10rpx;padding: 16rpx;"
								@tap="uploadvideo"></image><text v-if="video" style="padding-left:20rpx;color:#333">已上传短视频</text>
						</view>
						<input type="text" hidden="true" name="video" :value="video" maxlength="-1"></input>

						<view class="form-item" style="display:flex;gap:240rpx;border-color:#F1F5F8;background-color:#F1F5F8;border-radius:12rpx;padding:16rpx;margin-top:40rpx;">
							<view class="uploadbtn_ziti1">公开视频</view>
							<radio-group class="radio-group" name="is_my" style="font-size: 28rpx;margin-top: 10px;">
								<label class="gk-radio">
									<radio value="2" checked=""></radio>开启
								</label>
								<label class="gk-radio">
									<radio value="1"></radio>关闭
								</label>
							</radio-group>
						</view>
						<view class="apply_item">
							<view class="uploadbtn_ziti1">地址</view>
							<view class="flex-y-center"><input type="text" placeholder="请选择地址" name="address" :value="address"
									@tap="locationSelect"></input></view>
						</view>

						<!-- ==========商户======== -->
						<view class="uploadbtn_ziti1" style="position: relative;">
							选择商户 (非必选项)
							<view>
								<text
									@tap="selected_product_indexs = []  ,selected_shop_index = null,selected_shop =null, selected_prodcut_index = null,selected_products = [] "
									style="position:absolute;right:4px;margin:auto;top:-4rpx;color:#ff6767;font-size: 28rpx;border-radius: 5px;padding: 5px 5px;background-color: #ffe5e5;">清空选项</text>
							</view>
						</view>


						<view class="shop-selecter">
							<view class="wrapper flex-y-center">
								<view class="shop-info">
									<view class="shop-title" @tap="showShopPopup()">
										<block v-if="selected_shop">
											{{ selected_shop.name }}
										</block>
										<block v-else>
											选择商户
										</block>
									</view>

								</view>

								<view class="shop-join" @tap="goto" data-url="/pagesExt/business/apply">
									<view class="join-ing">
										<text>选择入驻</text>
									</view>
								</view>
							</view>
						</view>


						<view class="product-selecter" v-if="selected_shop">
							<view class="wrapper flex-y-center">
								<view class="product-info">
									<view class="product-title" @tap="showProPopup">
										<block v-if="selected_products.length">
											<block v-for="(item, index) in selected_products" :key="index">
												{{ item.name }}
												<block>,</block>
											</block>
										</block>
										<block v-else>
											选择商品
										</block>
									</view>

								</view>
								<view class="product-num" v-if="selected_products.length">
									<text>已选：{{ selected_products.length }}个</text>
								</view>
							</view>
						</view>
						<!-- ==========商户======== -->

					</view>
				</view>
				<view class="st_button flex-y-center">
					<button form-type="submit" :style="{background:'linear-gradient(-90deg,'+t('#ec81ff')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">立即发布</button>

					<button style="text-align:center;color:#fff;display:flex;align-items:center;justify-content:center"
						@tap="goto" data-url="/activity/shortvideo/myupload">发布记录
					</button>
				</view>


			</form>

		</block>
		<loading v-if="loading"></loading>
		<dp-tabbar :opt="opt"></dp-tabbar>
		<popmsg ref="popmsg"></popmsg>

		<!-- ==========================商户========================================== -->
		<liu-popup height="1096rpx" radius="12px" type="bottom" ref="shopPopup" :isMask="false">
			<view class="popup-container">
				<view class="popup-header">
					<text>选择商户</text>
				</view>

				<view class="popup-main">
					<view class="topsearch flex-y-center">
						<view class="f1 flex-y-center">
							<image class="img" src="/static/img/search_ico.png"></image>
							<input v-model="shop_keyword" placeholder="搜索感兴趣的商户" placeholder-style="font-size:24rpx;color:#C2C2C2"
								@confirm="shopSearchConfirm"></input>
							<view class="camera" v-if="set.image_search == 1" @tap="goto" data-url="/pagesExt/shop/imgsearch"
								:style="'background-image:url('+pre_url+'/static/img/camera.png)'"></view>
						</view>
					</view>

					<scroll-view :scroll-y="true" class="popup-list shop-list" @scrolltolower="popupScrollTolower($event,'shop')">
						<uv-radio-group @change="shopChange" v-model="selected_shop_index" placement="column">
							<view class="popup-list-item shop-list-item" v-for="(item, index) in shop_list" :key="index">
								<view class="item-header">
									<view class="shop-name">
										<view class="shop-icon">
											<image src="../../static/img/shop.png" mode=""></image>
										</view>
										<view class="shop-title">
											<text>{{ item.name }}</text>
										</view>
									</view>
								</view>

								<view class="item-main">
									<view class="image-area">
										<view class="image-block shop-image">
											<image :src="item.logo">
											</image>
										</view>
									</view>


									<view class="content-area">
										<view class="rate-area">
											<uv-rate active-color="#FF9900" :count="5" :value="parseFloat(item.comment_score)" readonly />
										</view>
										<view class="address-area">
											<image src="../../static/img/position.png" class="icon" mode=""></image>
											<text class="text">{{ item.address }}</text>
										</view>
										<view class="tel-area">
											<image src="../../static/img/phone.png" class="icon" mode=""></image>
											<text class="text">{{ item.tel }}</text>
										</view>
									</view>

									<view class="operate-area">
										<uv-radio activeColor="#ff9900" :name="index" shape="circle"></uv-radio>
									</view>
								</view>
							</view>
						</uv-radio-group>
						<nomore v-if="nomore"></nomore>
					</scroll-view>
				</view>


			</view>
		</liu-popup>

		<liu-popup height="1096rpx" radius="12px" type="bottom" ref="proPopup" :isMask="false">
			<view class="popup-container">
				<view class="popup-header">
					<text>选择商品</text>
				</view>

				<view class="popup-main popup-product-main">
					<view class="topsearch flex-y-center">
						<view class="f1 flex-y-center">
							<image class="img" src="/static/img/search_ico.png"></image>
							<input v-model="keyword" placeholder="搜索感兴趣的商品" placeholder-style="font-size:24rpx;color:#C2C2C2"
								@confirm="productSearchConfirm"></input>
							<view class="camera" v-if="set.image_search == 1" @tap="goto" data-url="/pagesExt/shop/imgsearch"
								:style="'background-image:url('+pre_url+'/static/img/camera.png)'"></view>
						</view>
					</view>

					<scroll-view :scroll-y="true" class="popup-list pro-list"
						@scrolltolower="popupScrollTolower($event,'product')">
						<uv-checkbox-group @change="productChange" v-model="selected_prodcut_index" placement="column">
							<view class="popup-list-item pro-list-item" v-for="(item, index) in product_list" :key="index">
								<view class="item-main">
									<view class="image-area">
										<view class="image-block shop-image">
											<image :src="item.pic">
											</image>
										</view>
									</view>


									<view class="content-area">

										<view class="pro-title-area">
											<text class="text">{{ item.name }}</text>
										</view>
										<view class="pro-price-area">
											<text style="font-size:24rpx;">￥</text>
											<text>{{ item.sell_price }}</text>
										</view>
									</view>

									<view class="operate-area">
										<uv-checkbox activeColor="#ff9900" :name="index" shape="circle"></uv-checkbox>
									</view>
								</view>
							</view>
						</uv-checkbox-group>
						<nomore v-if="nomore"></nomore>
					</scroll-view>
				</view>

				<view class="popup-footer">
					<uv-button type="success" text="确定" @tap="productPopupConfirm"></uv-button>
				</view>
			</view>
		</liu-popup>
		<!-- ===========================商户======================================== -->
		<!-- ===========================朋友======================================== -->
		<liu-popup height="1096rpx" radius="12px" type="bottom" ref="followPopup" :isMask="false">
			<view class="popup-container">
				<view class="popup-header">
					<text>选择朋友</text>
				</view>
		
				<view class="popup-main">
					
		
					<scroll-view :scroll-y="true" class="popup-list follow-list"
						@scrolltolower="popupScrollTolower($event,'follow')">
						<uv-checkbox-group @change="followChange" v-model="selected_follow_index" placement="column">
							<view class="popup-list-item follow-list-item" v-for="(item, index) in follow_list" :key="index">
								<view class="item-main">
									<view class="image-area">
										<view class="image-block shop-image">
											<image :src="item.headimg">
											</image>
										</view>
									</view>
					
					
									<view class="content-area">
					
										<view class="pro-title-area">
											<text class="text">{{ item.nickname }}</text>
										</view>
									</view>
					
									<view class="operate-area">
										<uv-checkbox activeColor="#ff9900" :name="index" shape="circle"></uv-checkbox>
									</view>
								</view>
							</view>
						</uv-checkbox-group>
						<nomore v-if="nomore"></nomore>
					</scroll-view>
				</view>
				
				<view class="popup-footer">
					<uv-button type="success" text="确定" @tap="followPopupConfirm"></uv-button>
				</view>
		
			</view>
		</liu-popup>
	</view>
</template>

<script>
	var app = getApp();
	import liuPopup from '../luntan/omponents/liu-popup/liu-popup.vue';
	export default {
		components: {
			liuPopup
		},
		data() {
			return {
				opt: {},
				loading: false,
				isload: false,
				menuindex: -1,

				pre_url: app.globalData.pre_url,
				datalist: [],
				content_pic: [],
				pagenum: 1,
				cateArr: [],
				cindex: -1,
				pics: [],
				video: '',
				sysset: {},
				address: '',
				longitude: '',
				latitude: '',


				shopPopup: false,
				proPopup: false,
				shop_list: [],
				product_list: [],
				selected_shop_index: null,
				selected_prodcut_index: null,
				selected_shop: null,
				selected_products: [],
				selected_product_indexs: [],
				shopPageNum: 1,
				productPageNum: 1,
				nomore: false,
				keyword: '',
				shop_keyword: '',
				videoDes: '',
				clist: [],
				activeTopic: 0,
				activeTopicarr:[],
				
				activeFollow:[],
				followPopup: false,
				follow_list: [],
				selected_follow_index: null,
				selected_follow: null,
				selected_follows: [],
				selected_follow_indexs: [],
				followPageNum: 1,
			};
		},

		onLoad: function(opt) {
			this.opt = app.getopts(opt);
		},
		created() {
			this.getdata();
		},
		onPullDownRefresh: function() {
			this.getdata();
		},
		methods: {
			handleVideoDes(e) {
				console.log(this.videoDes);
			},
			changeTopic(cid,cname) {
				var that = this;
				console.log(cid)
				if(that.activeTopicarr.includes(cid)){
					 that.activeTopicarr = that.activeTopicarr.filter(item => item !== cid);
				}else{
					if(that.activeTopicarr.length >=3){
						app.error('不能超过3个话题');
						return false;
					}
					 that.activeTopicarr.push(cid);
				}
				console.log(that.activeTopicarr)
				// this.activeTopic = index
			},
			getdata: function() {
				var that = this;
				that.loading = true;
				app.get('ApiShortvideo/uploadvideo', {}, function(res) {
					that.loading = false;
					if (res.status == 0) {
						app.alert(res.msg);
						return;
					}
					that.clist = res.clist;
					that.sysset = res.sysset;
					var clist = res.clist;
					if (clist.length > 0) {
						var cateArr = [];
						for (var i in clist) {
							if (that.opt && that.opt.cid == clist[i].id) {
								that.cindex = i;
							}
							cateArr.push(clist[i].name);
						}
					} else {
						cateArr = false;
					}
					that.cateArr = cateArr
					that.loaded();
				});
			},
			cateChange: function(e) {
				this.cindex = e.detail.value;
			},
			// 地址
			locationSelect: function() {
				var that = this;
				uni.chooseLocation({
					success: function(res) {
						console.log(res)
						that.address = res.address;
						that.latitude = res.latitude;
						that.longitude = res.longitude;
					},
					fail(err) {
						console.log("Select location fail!", err)
					}
				});
			},
			formsubmit: function(e) {
				var that = this;
				console.log(e);
				var clist = that.clist;
				if (clist.length > 0) {
					if (that.activeTopic == -1) {
						app.error('请选择话题');
						return false;
					}
					var cid = clist[that.activeTopic].id;
				} else {
					var cid = 0;
				}
				var formdata = e.detail.value;
				var title = formdata.title;
				if (title == '') {
					app.error('请输入标题');
					return false;
				}
				var content = formdata.content;
				var pics = formdata.pics;
				var video = formdata.video;
				var product = that.selected_products
				var shop = that.selected_shop
				var is_my = formdata.is_my;
				var address = formdata.address;
				
				if (pics == '') {
					app.error('请上传封面');
					return false;
				}
				if (video == '') {
					app.error('请上传短视频');
					return false;
				}
				app.post('ApiShortvideo/uploadvideo', {
					title: title,
					cid: cid,
					pics: pics,
					content: content,
					video: video,
					product: product,
					shop: shop,
					is_my: is_my,
					address: address,
					latitude: that.latitude,
					longitude: that.longitude,
					cids: that.activeTopicarr,//话题
					follows:that.selected_follows,//@好友
				}, function(res) {
					app.showLoading(false);
					if (res.status == 1) {
						app.success(res.msg);
						setTimeout(function() {
							app.goback(true);
						}, 1000);
					} else {
						app.error(res.msg);
					}
				});
			},
			uploadimg: function(e) {
				var that = this;
				var field = e.currentTarget.dataset.field
				var pics = that[field]
				if (!pics) pics = [];
				app.chooseImage(function(urls) {
					for (var i = 0; i < urls.length; i++) {
						pics.push(urls[i]);
					}
					if (field == 'pic') that.pic = pics;
					if (field == 'pics') that.pics = pics;
					if (field == 'zhengming') that.zhengming = pics;
				}, 1)
			},
			uploadvideo: function() {
				var that = this;
				//var maxDuration = that.sysset.upload_maxduration;
				//if(!maxDuration) maxDuration = 999999;
				var maxsize = that.sysset.upload_maxsize;
				if (!maxsize) maxsize = 999999999999999;
				uni.chooseVideo({
					compressed: false,
					sourceType: ['album', 'camera'],
					//maxDuration: maxDuration,
					success: function(res) {
						var tempFilePath = res.tempFilePath;
						var size = res.size;
						if (size > maxsize * 1024) {
							app.alert('短视频文件过大');
							return;
						}
						//console.log(size);return;
						app.showLoading('上传中');
						uni.uploadFile({
							url: app.globalData.baseurl + 'ApiImageupload/uploadImg/aid/' + app
								.globalData.aid + '/platform/' + app.globalData.platform +
								'/session_id/' + app.globalData.session_id + '/type/1',
							filePath: tempFilePath,
							name: 'file',
							success: function(res) {
								console.log(res)
								app.showLoading(false);
								var data = JSON.parse(res.data);

								if (data.status == 1) {
									that.video = data.url;

									if (data.ffmpeg_img) {
										var pics = []
										pics.push(data.ffmpeg_img);
										that.pics = pics;
									}

								} else {
									app.alert(data.msg);
								}
							},
							fail: function(res) {
								app.showLoading(false);
								app.alert(res.errMsg);
							}
						});
					},
					fail: function(res) {
						console.log(res); //alert(res.errMsg);
					}
				});
			},
			removeimg: function(e) {
				var that = this;
				var index = e.currentTarget.dataset.index
				var field = e.currentTarget.dataset.field
				var pics = that[field]
				pics.splice(index, 1)
			},

			// ===========商户
			showShopPopup(e) {
				var that = this;

				that.$refs.shopPopup.open()

				that.getBlistData()
			},
			showProPopup() {
				this.$refs.proPopup.open()

				this.getProductList()

			},
			getBlistData: function() {
				var that = this;
				that.loading = true
				that.nomore = false;
				app.post('ApiBusiness/blist', {
					field: "juli",
					keyword: "",
					latitude: "",
					longitude: "",
					order: "asc",
					pagenum: that.shopPageNum,
					keyword: that.shop_keyword
				}, function(res) {
					if (res.data.length === 0) {
						that.nomore = true

					} else {
						if (that.shop_list.length > 0) {
							that.shop_list.concat(res.data)
						} else {
							that.shop_list = res.data
						}
						that.shopPageNum++
					}
					that.loading = false
				});
			},
			shopChange(e) {
				const that = this
				console.log('shopChange', e)
				that.selected_shop = that.shop_list[e]
				this.product_list = []
				this.productPageNum = 1
				this.selected_product = null
				this.$refs.shopPopup.close()
			},
			popupScrollTolower(e, type) {
				console.log("type", type)
				if (type === "shop") {
					this.getBlistData()
				}
				if (type == 'product')
					this.getProductList()
					
				if (type == 'follow')
					this.getfollowData()
			},
			getProductList: function(loadmore) {
				var that = this;
				var pagenum = that.productPageNum;
				var st = 0
				const keyword = that.keyword
				that.loading = true;
				that.nomore = false;
				app.post('ApiBusiness/getdatalist', {
					id: that.selected_shop.id,
					st: st,
					pagenum: pagenum,
					yuyue_cid: 0,
					keyword: keyword
				}, function(res) {
					if (res.data.length === 0) {
						that.nomore = true

					} else {
						if (that.product_list.length > 0) {
							that.product_list.concat(res.data)
						} else {
							that.product_list = res.data
						}
						that.productPageNum++
					}
					that.loading = false
				});
			},
			productChange(e) {
				const that = this
				console.log(e)
				that.selected_product_indexs = e
				// this.$refs.proPopup.close()
			},
			productPopupConfirm() {
				const that = this
				that.selected_products = []
				that.selected_product_indexs.forEach((item, index) => {
					that.selected_products.push(that.product_list[index])
				})
				this.$refs.proPopup.close()
			},
			productSearchConfirm() {
				console.log(this.keyword)
				this.product_list = []
				this.productPageNum = 1
				this.getProductList()
			},
			shopSearchConfirm() {
				this.shop_list = []
				this.shopPageNum = 1
				this.getBlistData()
			},
			// ========朋友======
			showFollowPopup(e) {
				var that = this;
			
				that.$refs.followPopup.open()
			
				that.getFollowData()
			},
			getFollowData: function() {
				var that = this;
				that.loading = true
				that.nomore = false;
				app.post('ApiLuntan/getFollowUserList', {
					pagenum: that.followPageNum,
				}, function(res) {
					if (res.data.length === 0) {
						that.nomore = true
			
					} else {
						if (that.follow_list.length > 0) {
							that.follow_list.concat(res.data)
						} else {
							that.follow_list = res.data
						}
						that.followPageNum++
					}
					that.loading = false
				});
			},
			followChange(e) {
				const that = this
				console.log(e)
				that.selected_follow_indexs = e
				// this.$refs.proPopup.close()
			},
			followPopupConfirm() {
				const that = this
				that.selected_follows = []
				if(that.selected_follow_indexs.length >2){
					app.error('不能超过2个好友');
					return false;
				}
				that.selected_follow_indexs.forEach((item, index) => {
					that.selected_follows.push(that.follow_list[index].id)
				})
				this.$refs.followPopup.close()
			},
			
		}
	};
</script>
<style lang="less">
	page {
		background: #f7f7f7
	}

	.st_box {
		padding: 0rpx 0
	}

	.st_button {
		display: flex;
		justify-content: space-between;
		padding: 24rpx 10rpx 100rpx 10rpx;
	}

	.st_button button {
		border-radius: 16rpx;
		border: none;
		padding: 0 20rpx;
		color: #fff;
		font-size: 36rpx;
		text-align: center;
		width: 45%;
		display: flex;
		height: 70rpx;
		background: linear-gradient(-90deg,#03f4f4 0%,rgb(255 213 90) 100%);
		box-shadow: 2rpx 2rpx 30rpx #abecff;
		justify-content: center;
		align-items: center;
	}

	.st_form {
		padding: 24rpx;
		margin: 20rpx;
		border-radius: 30rpx;
		background: #fff;
	}

	.video-info {
		display: flex;
		gap: 32rpx;

		.des {
			flex: 1;

			>textarea {
				background: none !important;
				border: none;
			}
		}

		.video-cover {
			width: 200rpx;
			height: 240rpx;
			flex: none;
			border-radius: 12rpx;

			.uploadbtn {
				width: 100%;
				height: 100%;
				border-radius: 20rpx;
				background-color: #F3F3F3;
				display: flex;
				align-items: center;
				justify-content: space-around;
				flex-direction: column;

				>image {
					height: 80rpx;
					width: 80rpx;
					background: #ffffff;
					border-radius: 10rpx;
					padding: 20rpx;
				}
			}

			.upload-cover {
				position: relative;
				width: 100%;
				height: 100%;

				&-close {
					position: absolute;
					right: -14rpx;
					top: -14rpx;
					z-index: 2;

					>image {
						width: 28rpx;
						height: 28rpx;
					}
				}

				&-img {
					width: 100%;
					height: 100%;
				}
			}
		}


	}

	.action-area {
		.buttons {
			display: flex;

			gap: 40rpx;

			.action {
				width: fit-content;
				padding: 12rpx 20rpx;
				background-color: #ffd2d6;
				border-radius: 16rpx;
				box-shadow: 1rpx 1rpx 30rpx #ffdbde;
			}
		}

		.topic-list {
			margin-top: 24rpx;
			display: flex;
			gap: 24rpx;
			width: 100%;
			overflow-x: auto;
			flex-wrap: wrap;
			letter-spacing: 2rpx;
			font-size: 22rpx;

			/* 应用自定义滚动条样式 */
			&::-webkit-scrollbar {
				display: none;
			}

			.topic-item {
				padding: 12rpx 20rpx;
				background-color: #abecff;
				border-radius: 16rpx;
				box-shadow: 1rpx 1rpx 20rpx #abecff;
				flex: none
			}

			.active {
				background-color: #ffd2d4;
				color: #fff;
			}
		}
	}

	.st_form input {
		width: 100%;
		height: 104rpx;
		border: none;
		/*border-bottom: 1px solid #EEEEEE;*/
		color: #a2a2a2;
		border-radius: 16rpx;
		padding: 4rpx 20rpx;
		background-color: rgb(249, 249, 249);
		margin-top: 16rpx;
	}

	.st_form input::-webkit-input-placeholder {
		/* WebKit browsers */
		color: #BBBBBB;
		font-size: 24rpx
	}

	.st_form textarea {
		width: 100%;
		min-height: 200rpx;
		padding: 20rpx 0;
		border: none;
		border-bottom: 1px solid #EEEEEE;
	}

	.layui-imgbox {
		margin-right: 16rpx;
		margin-bottom: 10rpx;
		font-size: 24rpx;
		position: relative;
	}

	.layui-imgbox-close {
		position: absolute;
		display: block;
		width: 32rpx;
		height: 32rpx;
		right: -16rpx;
		top: -16rpx;
		z-index: 90;
		color: #999;
		font-size: 32rpx;
		background: #fff
	}

	.layui-imgbox-close image {
		width: 100%;
		height: 100%
	}

	.layui-imgbox-img {
		display: block;
		width: 200rpx;
		height: 200rpx;
		padding: 2px;
		border: #d3d3d3 1px solid;
		background-color: #f6f6f6;
		overflow: hidden
	}

	.layui-imgbox-img>image {
		max-width: 100%;
	}

	.layui-imgbox-repeat {
		position: absolute;
		display: block;
		width: 32rpx;
		height: 32rpx;
		line-height: 28rpx;
		right: 2px;
		bottom: 2px;
		color: #999;
		font-size: 30rpx;
		background: #fff
	}



	.uploadbtn_ziti1 {
		height: 30rpx;
		line-height: 30rpx;
		font-size: 28rpx;
		margin-top: 50rpx;
	}

	.uploadbtn_ziti2 {
		height: 30rpx;
		line-height: 30rpx;
		font-size: 26rpx;
		padding-top: 20rpx;
		margin-top: 20rpx;
		/*border-top: 1px solid #EEEEEE;*/
		color: #bfbfbf;
	}

	.gk-radio {
		color: #bfbfbf;
		padding: 10px;
	}
</style>